<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>AxsJAX Enhanced Wikipedia User Guide</title>
</head>

<body>

<p align="center"><font size="6">AxsJAX - Enhanced Wikipedia User Guide</font></p>
<p align="left"><font size="5">Table of Contents</font></p>
<ol>
	<li>
	<p align="left"><font size="4"><a href="#1">What is AxsJAX Enhanced 
	Wikipedia</a></font></li>
	<li>
	<p align="left"><font size="4"><a href="#2">What are the new features</a></font></li>
	<li>
	<p align="left"><font size="4"><a href="#3">How to start using the AxsJAX 
	enhanced wikipedia</a></font></li>
	<li>
	<p align="left"><font size="4"><a href="#4">Future work</a></font></li>
</ol>
<p align="left"><b><font size="4"><a name="1"></a>1. What is AxsJAX Enhanced 
Wikipedia</font></b></p>
<p align="left"><a href="http://code.google.com/p/google-axsjax">AxsJAX</a> is a 
Google project for injecting accessibility enhancements as defined by
<a href="http://www.w3.org/TR/aria-roadmap">W3C ARIA</a> (Accessible Rich 
Internet Applications). AxsJAX Enhanced Wikipedia is the wikipedia with some 
accessibility enhancements using AxsJAX. The enhancements can be divided into two parts</p>
<ul>
	<li>
	<p align="left">The enhancements for the main wikipedia web site (<a href="http://www.wikipedia.org">http://www.wikipedia.org</a>) 
	that provide audio help for language selection to the user.</p></li>
	<li>
	<p align="left">The enhancements for the english language version of the 
	wikipedia web site (<a href="http://en.wikipedia.org">http://en.wikipedia.org</a>) 
	that help the user in navigating the search results. </p></li>
</ul>
<p align="left">However, most of the help keys provide similar functionality in 
both cases.&nbsp; </p>
<p align="left"><b><font size="4"><a name="2"></a>2. What are the new features</font></b></p>
<p align="left">The first set of enhancements are for language selection. They 
get activated when the user is on the <a href="http://www.wikipedia.org">
http://www.wikipedia.org</a> web site. The following key functions are 
available. </p><span LANG="EN">
<table border="1" width="100%" id="table2">
	<tr>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0" width="46">
		<p style="margin-top: 0; margin-bottom: 0" align="center"><span LANG="EN">? </span>
		</td>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to 
		listen to key shortcuts available</span></td>
	</tr>
	<tr>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0" width="46">
		<p style="margin-top: 0; margin-bottom: 0" align="center">esc<span LANG="EN"> </span>
		</td>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to go 
		to audio language selection</span></td>
	</tr>
	<tr>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0" width="46" align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">/ </span>
		</td>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp; to 
		exit the audio language selection and put focus back on search box</span></td>
	</tr>
	<tr>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0" width="46" align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">n </span>
		</td>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to go 
		to next language while in audio selection</span></td>
	</tr>
	<tr>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0" width="46" align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">p </span>
		</td>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to go 
		to previous language while in audio selection</span></td>
	</tr>
	<tr>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0" width="46" align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">enter </span>
		</td>
		<td style="padding-left: 4px; padding-right: 4px" bordercolor="#C0C0C0">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to 
		select a particular language while in audio language selection</span></td>
	</tr>
</table>
</span>
<p align="left">The second set of enhancements are for navigation of the search 
contents. These are activated when the user is on the
<a href="http://en.wikipedia.org">http://en.wikipedia.org</a> web site. The 
following key functions are available</p><span LANG="EN">
<table border="1" width="100%" id="table3">
	<tr>
		<td align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">? </span>
		</td>
		<td>
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to 
		listen to key shortcuts available</span></td>
	</tr>
	<tr>
		<td align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">/ </span>
		</td>
		<td>
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to 
		direct focus on the search box. Anything the user enters after this is 
		considered search text</span></td>
	</tr>
	<tr>
		<td align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">esc </span>
		</td>
		<td>
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to 
		leave the search box</span></td>
	</tr>
	<tr>
		<td align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">g </span>
		</td>
		<td>
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to go 
		to the table of contents (TOC)</span></td>
	</tr>
	<tr>
		<td align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">n </span>
		</td>
		<td>
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to go 
		to next item while reading the TOC or to the next paragraph while 
		reading the paragraphs or the citations.</span></td>
	</tr>
	<tr>
		<td align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">p </span>
		</td>
		<td>
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to go 
		to the previous item while reading the TOC or to the previous paragraph 
		while reading the paragraphs or the citations.</span></td>
	</tr>
	<tr>
		<td align="center">
		r</td>
		<td>
		&nbsp;to read out the number of links and citations in the current 
		paragraph.</td>
	</tr>
	<tr>
		<td align="center">
		t</td>
		<td>
		&nbsp;to start reading the citations in the paragraph. To move to next 
		citation, the user has to press t again. When the current citation is 
		read out, the user can press enter to open a new page that is the 
		reference of the citation just read out. </td>
	</tr>
	<tr>
		<td align="center">
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">enter </span>
		</td>
		<td>
		<p style="margin-top: 0; margin-bottom: 0"><span LANG="EN">&nbsp;to 
		start reading the paragraphs in a particular section of the document&nbsp; while reading the TOC 
		or to open a new page while reading the citations (the new page is the 
		reference of the citation).</span></td>
	</tr>
</table>
</span>
<p align="left">While on the <a href="http://en.wikipedia.org">
http://en.wikipedia.org</a> web site, the user can be in one of the three states</p>
<ol>
	<li>
	<p align="left">Reading the paragraphs on the page (default mode). In this 
	case the navigation is using the n and p keys. In this state, user can use 
	the g key to go to the table to contents (TOC) or the / key to go to the 
	search box.</p></li>
	<li>
	<p align="left">Reading the citations in a particular paragraph. This state 
	is reached by pressing t when reading a paragraph. To move to next citation 
	press t again. Use n and p keys to go back to reading the paragraphs or the 
	g key to go back to reading the table of contents. </p></li>
	<li>
	<p align="left">Reading the table of contents. In this case, the navigation 
	is using the n and p keys. In this state, doing an enter will start reading 
	the paragraphs in the current section of the TOC. The / key in this state 
	will direct focus on the search box. </p></li>
	<li>
	<p align="left">Inputting text in the search box. An enter will open a new 
	page with the search results. An esc will trap the user out of the search 
	box. The user can now start using the n and p keys for doing the navigation.
	</p></li>
</ol>
<p align="left">The Figure below shows the navigation structure for the 
wikipedia web site. </p>
<p align="left"><img border="0" src="WikipediaFSM.jpg" width="528" height="507"></p>
<p align="left">Figure 1. Navigation structure for the wikipedia web site. </p>
<p align="left">When the page first load, the finite state machine shown above 
is in the reading paragraphs mode. The user can start using the n and p keys to 
read through the paragraphs. </p>
<p align="left"><b><font size="4"><a name="3"></a>3. How to start using the 
AxsJAX enhanced Wikipedia</font></b></p>
<p>All you need to do is make sure that you have the following: </p>
<ol>
	<li>A modern Web browser like Firefox 2.0 or later that supports W3C ARIA. 
	</li>
	<li>An adaptive technology that will respond correctly to the accessibility 
	enhancements introduced by W3C ARIA. In particular, many of the enhancements 
	injected by AxsJAX depend on support for <i>live regions</i> a feature that 
	enables adaptive technologies like screen readers and self-voicing browsers 
	deal correctly with asynchronous updates to portions of a Web page. </li>
</ol>
If your setup meets these requirements, you would need to install
<a href="http://addons.mozilla.org/firefox/748">GreaseMonkey</a> and then 
install the
<a href="http://ss12.info/svn/axsjax/Wikipedia/wikipediaaccessibilityenhan.user.js">GreaseMonkey script for AxsJAX enhancements for 
wikipedia</a>. Restart the 
browser. Open the <a href="http://www.wikipedia.org/">wikipedia web site</a> and 
start searching. Please note that while there are language versions of wikipedia, the enhancements were developed only for 
the <a href="http://en.wikipedia.org/">English language version</a> as a proof 
of concept. The implementation files for the project can be found at
<a href="http://ss12.info/svn/axsjax/Wikipedia">http://ss12.info/svn/axsjax/Wikipedia</a>.<p><b><font size="4"><a name="4"></a>4. Future Direction</font></b></p>
<p>We need to add handling for 
web pages that have no defined paragraphs or table of contents. </p>
<p>Authors: <a href="http://www.isi.edu/~gurmeet/index.html">Gurmeet Singh</a> &lt;<a href="mailto:gurmeets@usc.edu">gurmeets@usc.edu</a>&gt;, 
Arvind Venkataraman &lt;<a href="mailto:arvindve@usc.edu">arvindve@usc.edu</a>&gt;, 
Kushal Bhatt &lt;<a href="mailto:kbhatt@usc.edu">kbhatt@usc.edu</a>&gt;, 
Christopher Leung &lt;<a href="mailto:christopher.leung@projectpossibility.org">christopher.leung@projectpossibility.org</a>&gt;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

</body>

</html>
